import type { RefObject } from "react";
import { create } from "zustand";

interface ModalState {
	modals: Map<string, RefObject<HTMLElement>>;
	addModal: (key: string, ref: RefObject<HTMLElement>) => void;
	removeModal: (key: string) => void;
	getModal: (key: string) => RefObject<HTMLElement> | undefined;
}

export const useModalStore = create<ModalState>()((set, get) => ({
	modals: new Map<string, RefObject<HTMLElement>>(),
	addModal: (key: string, ref: RefObject<HTMLElement>) => {
		set((state) => {
			const newModals = new Map(state.modals);
			newModals.set(key, ref);
			return { modals: newModals };
		});
	},
	removeModal: (key: string) => {
		set((state) => {
			const newModals = new Map(state.modals);
			newModals.delete(key);
			return { modals: newModals };
		});
	},
	getModal: (key: string) => {
		return get().modals.get(key);
	},
}));
